<template>
	<view class="box">
		这是home页面
	</view>
	<view class="box">
		<image class="img" :src="imgUrl"></image>
	</view>
	<view class="box">
		<button @click="openCamera">按钮</button>
	</view>
	{{imgUrl}}
</template>

<script>
	export default {
		data() {
			return {
				imgUrl:"../../static/test.png"
			}
		},
		methods: {
			openCamera() {
				let that = this
				var cmr = plus.camera.getCamera(0)
				var res = cmr.supportedImageResolutions[0];
				var fmt = cmr.supportedImageFormats[0];
				cmr.captureImage(function(path) {
						console.log("Capture image success: " + path);
						that.imgUrl = path
					},
					function(error) {
						console.log("Capture image failed: " + error.message);
					}, {
						resolution: res,
						format: fmt
					}
				);
			}
		}
	}
</script>

<!-- scoped 防止样式互相污染 less -->
<style scoped>
	.box {
		/* 设置文字大小，rpx是移动端适配设计单位 */
		font-size: 50rpx;
		/* 设置文字粗细 */
		font-weight: bold;
		/* 文字颜色 */
		color: red;
		/* 文字样式  黑体、楷体、华文彩云*/
		font-family: '华文彩云';
		/* 设置宽度大小 */
		width: 400rpx;
		height: 200rpx;
		/* 设置边框  宽度 线的样式 颜色 */
		border: 2rpx solid black;
		/* 设置背景颜色 */
		background-color: aqua;
		/* 文字居中（弹性容器） */
		display: flex;
		/* 将当前的view设置为弹性容器 */
		/* 水平方向内容位置 left center right */
		justify-content: center;
		/* 垂直方向的内容位置 start center end */
		align-items: center;
		/* 超出内容隐藏 */
		overflow: hidden;
	}

	.img {
		/* 设置宽高 百分比 */
		width: 100%;
		height: 100%;
	}
</style>